<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>订单记录</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<script type="text/javascript">
			document.write('<script src="../../js/fix.js?rd=?rd=' + Math.random() + '"><\/script>');
		</script>
		<script type="text/javascript">
			link(['../../css/reset.css']);
		</script>
		<script type="text/javascript">
			//必须顺序加载
			script();
		</script>
		<style type="text/css">
			html,body{
				background: #f8f8f8;
			}
			.order_box .head {
				background: #f8f8f8;
				height: 0.4rem;
				line-height: 0.4rem;
				padding-left: 0.15rem;
				color: #999999;
			}

			.order_box ul {
				padding: 0rem;
				margin: 0rem;
			}

			.order_box li {
				display: flex;
				height: 0.5rem;
				line-height: 0.5rem;
				background: #FFFFFF;
				padding: 0rem 0.15rem;
				color: #545454;
				margin-bottom: 1px;
			}

			.order_box .total {
				flex: 1;
			}

			.order_box li div {
				text-align: center;
				flex: 1;
			}

			.order_box li div:first-child {
				text-align: left;
			}

			.order_box li div:last-child {
				padding-right: 0.15rem;
				text-align: right;
			}
				.totalli div{
					color: #47BAFE;
				}
			.total {
				text-align: center !important;
			}
		
			.none_order {
				padding-top: 30%;
				background: #F8F8F8;
				text-align: center;
			}
		</style>
	</head>
	<body style="display: none; opacity: 0;">
<!-- 		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">订单记录</h1>
		</header> -->
		<div class="mui-content">
			
			<div class="order_box">
				<div class="none_order" id="noorder" style="display: none;">
					<img src="../../images/mine/no_order.png" alt="">
					<p>暂无订单</p>
				</div>
				<ul id="orderAuctionList">
				
				</ul>

			</div>

		</div>

		<script>
			mui.plusReady(function() {
				storage.init();
				storageUser = kidstorageuser.getInstance();
				request("/cmdb/queryPayHisBySalesID/", {
					sales_id: storageUser.UId
				}, function(r) {
					let data = r.DATASET;
					if(data.length==0){
						document.getElementById("orderAuctionList").style.display="none";
						document.getElementById("noorder").style.display="block";
					}else{
						document.getElementById("orderAuctionList").style.display="block";
						document.getElementById("noorder").style.display="none";
					}
					var getdate = function(date) {
						let year = new Date(date).getFullYear();
						let mouth = new Date(date).getMonth() + 1;
						return year.toString().substring(2,4) +"年"+ mouth.toString();
					}
					let group = [];
					let object = {};
					data.sort(function(a, b) {
						// if(new Date(a.pay_date).getMonth()+1 == new Date(b.pay_date).getMonth()+1);
						return b.pay_date > a.pay_date ? 1 : -1;
					})
					// alert(JSON.stringify(group));
					for (let i = 0; i < data.length; i++) {
						var ai = data[i];
						if (!object[getdate(ai.pay_date)]) {
							object[getdate(ai.pay_date)] = ai;
							group.push({
								group: getdate(ai.pay_date),
								data: [ai]
							});
						} else {
							for (var j = 0; j < group.length; j++) {
								var dj = group[j];
								if (dj.group == getdate(ai.pay_date)) { //依赖分组字段可自行更改！
									dj.data.push(ai);
									break;
								}
							}
						}
					}

					// alert(group.length);
					let ul = document.getElementById("orderAuctionList");
                     
					for (let j = 0; j < group.length; j++) {
						let ulHtml="";
						let priceCount=0;
						let tcnt=0;
						for (let i = 0; i < group[j].data.length; i++) {
							priceCount=parseFloat(group[j].data[i].pay_amt)+parseFloat(priceCount);
							tcnt=parseInt(group[j].data[i].ticket_cnt)+parseFloat(tcnt);
							let time = group[j].data[i].pay_date.substring(0, 16);
							let li_html = '<div>' + time + '</div><div>购买' + group[j].data[i].ticket_cnt + '张</div><div>' + parseFloat(group[j].data[i].pay_amt).toFixed(2) +
								'元</div>';
							const li = document.createElement("li");
							li.innerHTML = li_html;
							ul.appendChild(li);
							if(i==group[j].data.length-1){
								let count='<li class="totalli"><div class="total">合计：</div><div>'+tcnt+'张</div><div class="priceTotal">'+priceCount.toFixed(2)+'元</div></li>'
							
							  li.insertAdjacentHTML("afterEnd",count);
							}
							if(i==0){
								let head="";
								if(getdate(new Date(group[j].data[i].pay_date))==getdate(new Date())){
									 head='<li class="head" style="background: #f8f8f8;">本月</li>'
								}else{
									 head='<li class="head" style="background: #f8f8f8;">'+getdate(new Date(group[j].data[i].pay_date))+'月</li>'
								}
								li.insertAdjacentHTML('beforebegin',head);
							}
							ulHtml=ul.innerHTML;

						}

					
					}

				})
			});
		</script>
	</body>
</html>
